<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%  
response.setHeader("Access-Control-Allow-Origin", "*");  
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>名医大全·数据工厂</title>
<link href="${pageContext.request.contextPath }/img/webLogoIcon.png"
	rel="shortcut icon">
<link href="${pageContext.request.contextPath }/css/bootstrap.min.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath }/css/font-awesome.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath }/css/animate.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath }/css/style.css"
	rel="stylesheet">
<!-- FooTable -->
<link href="${pageContext.request.contextPath }/css/footable.core.css"
	rel="stylesheet">
<link href="${pageContext.request.contextPath}/css/mypage.css"
	rel="stylesheet">
</head>
<body>
	<div id="wrapper">
		<nav class="navbar-default navbar-static-side" role="navigation">
		<%request.setAttribute("LEFT", "doctor");%> <%@include file="../components/left.jsp"%>
		</nav>
		<div id="page-wrapper" class="gray-bg">
			<div class="row border-bottom m-b-20">
				<jsp:include page="../components/head.jsp" flush="true" />
			</div>
			<div class="row wrapper border-bottom white-bg page-heading">
				<div class="col-lg-9">
					<h2>名医大全</h2>
					<ol class="breadcrumb">
						<li class="nav-main1"><a
							href="${pageContext.request.contextPath}/admin/tosystem_overview">主页</a>
						</li>
						<li class="active"><span>名医大全</span></li>
					</ol>
				</div>
			</div>
			<div class="wrapper wrapper-content animated fadeInRight">
				<div class="row">
					<div class="col-lg-12">
					<div class="ibox float-e-margins barcontent" id="barcontent"></div>
						<div class="ibox float-e-margins">
							<div class="ibox-content">
								<div class="row m-t-sm">
									<div class="col-lg-12">
										<div class="panel blank-panel">
											<div class="panel-body">
												<div class="tab-content">
												<div class="input-select" style="margin-bottom: 20px">
	                               		<div class="input-selectbox">
                                            <button data-toggle="dropdown" class="btn btn-primary dropdown-toggle" type="button">
                                            <i class="fa fa-bars"></i>
                                            <span id="inputSelected">姓名</span></button>
                                            <ul class="dropdown-menu" id="selectlist">
                                            	<li><a onclick="setselect(this)">姓名</a></li>
                                                <li><a onclick="setselect(this)">医院</a></li>
                                                <li><a onclick="setselect(this)">擅长领域</a></li>
                                                <li><a onclick="setselect(this)">所属科室</a></li>
                                            </ul>
	                                        <input id="searchKeyWord" type="text" class="form-control" style="width:440px;padding-right: 42px;">
	                                        <i id="gosearch" class="fa fa-search cursearch" onclick="article(1)"></i>
										</div>
										<!-- <div class="form-group">
										  <label for="">所属科室：</label>
										  <input type="text"
											class="form-control" id="department" aria-describedby="helpId" placeholder="请输入所属科室">
										</div> -->
	                                </div>
													<div class="tab-pane active" id="tab-1">

														<div class="feed-activity-list" id="list"></div>
														<div class="feed-activity-list" id="logs">
															<div class="box" id="box" style="float: right;"></div>
														</div>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<jsp:include page="../components/footer.jsp" flush="true" />
		</div>
	</div>
	<!-- Mainly scripts -->
	<script src="${pageContext.request.contextPath }/js/jquery-2.1.1.js"></script>
	<script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/jquery.metisMenu.js"></script>
	<script
		src="${pageContext.request.contextPath }/js/jquery.slimscroll.min.js"></script>
	<!-- Custom and plugin javascript -->
	<script src="${pageContext.request.contextPath }/js/inspinia.js"></script>
	<script src="${pageContext.request.contextPath }/js/pace.min.js"></script>
	<!-- FooTable -->
	<script
		src="${pageContext.request.contextPath }/js/footable.all.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/mypage.js"></script>
	<!-- Page-Level Scripts -->
	<script src="${pageContext.request.contextPath}/js/anychart-base.min.js"></script>
	<script src="${pageContext.request.contextPath}/js/userCustom.js"></script>
	<script>
		function setselect(el){
			document.getElementById("inputSelected").innerHTML=el.text
		}

	var data = 
		[
		     ['内科', '4054'],
		     ['外科', '9410'],
		     ['妇产科', '6610'],
		     ['男科', '7130'],
		     ['儿科', '8000'],
		     ['五官科', '4760'],
		     ['肿瘤科', '1670'],
		     ['皮肤科', '2210'],
		     ['感染科', '2980'],
		     ['其他', '1450']
			]
	createbar("barcontent","名医科室分布",data)
        $(document).ready(function() {
            $('.footable').footable();
        });
        
        $(function(){
        	article(1)
		});
        
		function article(pageNum){
			let matchingmode=document.getElementById("inputSelected").textContent
			let searchKeyWord=document.getElementById("searchKeyWord").value.trim()
			if(searchKeyWord===''){
				matchingmode=undefined
			}
        	$.ajax({
        		url : "${pageContext.request.contextPath}/doctor/doctorlist",
        		type : "post",
        		data:{
        			pageNum: pageNum,
					matchingmode: matchingmode,
					searchKeyWord: searchKeyWord==='' ? undefined : searchKeyWord
        		},
        		success : function(res1) {
        			let res = JSON.parse(res1);
        			paging(res.totalData, res.totalPage, pageNum)
        			var list = res.list
        			$('#list').html('')
        			for (var i = 0; i < list.length; i++) {
        				var adept = list[i].adept;
        				if (adept && adept.length > 150) {
        					adept = adept.substring(0, 150) + '......';
						}
        				var content = list[i].content;
        				if (content && content.length > 150) {
        					content = content.substring(0, 150) + '......';
						}
          				var honor = list[i].honor;
        				if (honor && honor.length > 150) {
        					honor = honor.substring(0, 150) + '......';
						}
        				var visiting_time = JSON.parse(list[i].visiting_time);
        				var visiting_timehtml = '';
        				for ( var key in visiting_time) {
        					if (visiting_time[key].length > 0) {
            					visiting_timehtml += '<span style="margin-right: 30px;">'+key+'('+visiting_time[key].join(",")+')</span>'
							}
						}
        				if (visiting_timehtml) {
        					visiting_timehtml = '<p>出诊时间： '+visiting_timehtml+'</p>'
						}
        				var profile = list[i].profile;
        				console.log(list[i])
						var html = 
			 				"<div class='custom-article b-b'>"+
			 			    "    <div class='article-search-result'>"+
			 			    "        <div class='article-imgbox' style='width:135px;'>"+
			 			    "           <img style='width: auto !important;height:100%;margin:0 auto;' src='"+profile+"' onerror='defalutImg(this)'>"+
			 			    "        </div>"+
			 			    "        <div class='article-content'>"+
			 			    "        	<div class='article-content-title'>"+
			 			    "          		<a href='${pageContext.request.contextPath}/doctor/doctor-detail?article_public_id="+list[i].article_public_id+"' target='_blank'>" + list[i].name + "</a>"+
			 			    "            </div>"+
			 				"            <div class='article-content-con'> " + 
			 				'<div>'+
                   			'<span style="margin-right: 30px;">所属医院: '+list[i].hospital+'</span>'+
                   			'<span style="margin-right: 30px;">所属科室: '+list[i].department+'</span>'+
                   			'<span style="margin-right: 30px;">擅长: '+adept+'</span>'+
                   			'<span style="margin-right: 30px;">居住地: '+list[i].province+'  '+list[i].city+'  '+list[i].area+'</span>'+
                   			'<span style="margin-right: 30px;">学位: '+list[i].degree+'</span>'+
                   			'<span style="margin-right: 30px;">论文发表: '+list[i].paper+'</span>'+
                   			'<span style="margin-right: 30px;">电话: '+list[i].phone_number+'</span>'+
                   			'<span style="margin-right: 30px;">工作地址: '+list[i].location+'</span>'+
                   			'</div>'+
                   			'<div>擅长: '+adept+'</div>'+
	                   		'<div>简介: '+content+'</div>'+
			 				"			</div>"+
			 				"    	</div>"+
			 				"    </div>"
							
					     $('#list').append(html)
					}
        			if (list.length == 0) {
        				$('#list').html('<div class="feed-element">暂无数据！</div>')
					}
        		},
        		error: function(res) {
        			console.log(res);
        		}
        	});
        }
		
		function defalutImg(obj){
			obj.src = '${pageContext.request.contextPath}/img/doctor.png';
			obj.onerror = null;
		}

		function paging(totalData, totalPage, pagenum) {
			$('#box').paging({
				initPageNo : pagenum, // 初始页码
				totalPages : totalPage, //总页数
				totalCount : '合计' + totalData + '条数据', // 条目总数
				slideSpeed : 600, // 缓动速度 单位毫秒
				jump : true, //是否支持跳转
				callback : function(page) {
				}
			});
		}

		function JumpToPage(pageNum) {
			article(pageNum)
		}

		//跑马灯方法 
// 		function init() {
// 			//获取标题
// 			var title = document.title;
// 			//分割字符串--->字符数组
// 			var arr = title.split("");
// 			//删除第一个元素并返回该元素
// 			var e = arr.shift();
// 			//把一个对象添加到数组末尾
// 			arr.push(e);
// 			//把数组转换成字符串
// 			var marquee = arr.join("");
// 			//返回给浏览器
// 			document.title = marquee;
// 			//定时一直执行
// 			window.setTimeout("init()", 1000);
// 		}
// 		window.onload = init;
	</script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
</body>
</html>
